<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Library Management System</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
    <div class="container">
        <h1>Library Management System</h1>

        <!-- 添加书籍 -->
        <h2>Add Book</h2>
        <input type="text" id="title" placeholder="Title">
        <input type="text" id="author" placeholder="Author">
        <input type="text" id="isbn" placeholder="ISBN">
        <button onclick="addBook()">Add Book</button>

        <!-- 查找书籍 -->
        <h2>Find Book</h2>
        <input type="text" id="searchTitle" placeholder="Enter Title">
        <button onclick="findBook()">Find Book</button>
        <div id="searchResult"></div>

        <!-- 显示所有书籍 -->
        <h2>All Books</h2>
        <button onclick="showAllBooks()">Show All Books</button>
        <div class="book-list" id="bookList"></div>
    </div>

    <script src="{{ url_for('static', filename='script.js') }}"></script>
</body>
</html>